<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>消息</title>
    <link rel="stylesheet" type="text/css" href="__CSS__api.css" />
    <link rel="stylesheet" type="text/css" href="__CSS__aui.css" />
    <link rel="stylesheet" type="text/css" href="__CSS__dropload.css" />

    <style>
        body {
            background-color:#F5F5F5;
        }
        .message{
            font-size:17px;
            color:#333333;
            background-color: #FFFFFF;
            padding-left:0.75rem;
            padding-right:0.75rem;
            padding-bottom:0.75rem;
        }
        .tit{
            height:2.3rem;
            line-height:2.3rem;
            font-weight:bold;
        }
        .time{
            font-size:13px;
            color:#999999;
            font-weight:normal;
        }
        .red_dot{
            width:6.4px;
            height:6.4px;
            background-color: #FF2A00;
            border-radius:50%;
            margin-top:18px;
            margin-right:0.4rem;
        }
        .message_pic{
            width:2.5rem;
            height:2.5rem;
            margin-right:0.5rem;
        }
        .content{
            font-size:15px;
            color:#666666;
            line-height: 1.05rem;
        }
    </style>
</head>

<body>
<header class="aui-bar aui-bar-nav underLine" style="padding-top:0px;" id="header">
    <a class="aui-pull-left" tapmode="active" onclick="history.go(-1)"> <span class="aui-iconfont aui-icon-tu"> </span> </a>
    <div class="aui-title">消息</div>
</header>
<div class="upOrDown">
    <div class="upOrDown_data">
            {volist name="data"  id="vo"}
            <div class="message underLine2" onclick="fnDetails(this)" n_activitie="{$vo.n_activitie}" n_type="{$vo.n_type}" tapmode='active' n_id='{$vo.n_id}'>
                <div class="tit flex-wrap">
                    {if $vo['read']==2}
                    <div class="red_dot"></div>
                    {/if}
                    {if $vo['n_type']==1}
                    <div class="flex-con aui-ellipsis-2">系统消息</div>
                    {elseif $vo['n_type']==2 /}
                    <div class="flex-con aui-ellipsis-2">活动报名</div>
                    {elseif $vo['n_type']==3 /}
                    <div class="flex-con aui-ellipsis-2">活动开始</div>
                    {elseif $vo['n_type']==4 /}
                    <div class="flex-con aui-ellipsis-2">活动签到</div>
                    {/if}
                    <div class="time">{$vo.n_createtime}</div>
                </div>
                {if $vo['n_type']==1}
                <div class="flex-wrap">
                    <div class="message_pic"><img src="__IMG__132413775293291296.png" alt="" /></div>
                    <div class="flex-con aui-ellipsis-2 content">
                        {$vo.n_title}
                    </div>
                </div>
                {elseif $vo['n_type']==2 /}
                <div class="flex-wrap">
                    <div class="message_pic"><img src="__IMG__840968833709767202.png" alt="" /></div>
                    <div class="flex-con aui-ellipsis-2 content">
                        {$vo.n_title}
                    </div>
                </div>
                {elseif $vo['n_type']==3 /}
                <div class="flex-wrap">
                    <div class="message_pic"><img src="__IMG__840968833709767202.png" alt="" /></div>
                    <div class="flex-con aui-ellipsis-2 content">
                        {$vo.n_title}
                    </div>
                </div>
                {elseif $vo['n_type']==4 /}
                <div class="flex-wrap">
                    <div class="message_pic"><img src="__IMG__879673021421927563.png" alt="" /></div>
                    <div class="flex-con aui-ellipsis-2 content">
                        {$vo.n_title}
                    </div>
                </div>
                {/if}
            </div>
            {/volist}
        </div>
    </div>
</body>
<script type="text/javascript" src="__JS__jquery.min.js"></script>
<script type="text/javascript" src="__JS__layer_mobile/layer.js"></script>
<script type="text/javascript" src="__JS__dropload.min.js"></script>
<script type="text/javascript" src="__JS__api.js"></script>
<script type="text/javascript" src="__JS__tt.js"></script>
<script type="text/javascript" src="__JS__aui-actionsheet.js"></script>
<script type="text/javascript" src="__JS__doT.min.js"></script>
<script type="text/javascript" src="__JS__aui-lazyload.js"></script>
<script type="text/javascript">

    // 详情
    function fnDetails(el){
        n_id= $api.attr(el, 'n_id');
        n_type= $api.attr(el, 'n_type');
        n_activitie= $api.attr(el, 'n_activitie');
        var idd="dian_"+n_id;
        //红点消失
        $api.addCls($api.byId(idd),'hidden');
        $.ajax({
            url:'{:url("First/readmessage")}',
            data:{n_id:n_id},
            type:'POST',
            dataType:'json',
            success:function (data) {

                    if(n_type==1){
                        location.href = '{:url("First/messagedetail")}?n_id='+n_id;
                    }else{
                        location.href = '{:url("First/activitydatail")}?activity_id='+n_activitie;
                    }

            }
        })
    }
//    function fnDetails(){
//        var parame = {
//        }
//        openWindow("xiaoxi_win", "../main5/xiaoxi_win.html", parame);
//    }
</script>
<script>
    var page = 1;
    /**
     * 上拉加载，下拉刷新
     */
    var dropload = $('.upOrDown').dropload({
        scrollArea : window,
        autoLoad : true,
//        domUp : {
//            domClass   : 'dropload-up',
//            domRefresh : '<div class="dropload-refresh">↓下拉刷新-自定义内容</div>',
//            domUpdate  : '<div class="dropload-update">↑释放更新-自定义内容</div>',
//            domLoad    : '<div class="dropload-load"><span class="loading"></span>加载中-自定义内容...</div>'
//        },
//        domDown : {
//            domClass   : 'dropload-down',
//            domRefresh : '<div class="dropload-refresh">刷新</div>',
//            domLoad    : '<div class="dropload-load"><span class="loading"></span>加载中...</div>',
//            domNoData  : '<div class="dropload-noData">无数据</div>'
//        },
        loadDownFn : function(me){
            page++;
            $.ajax({
                url:'{:url("First/ajaxmessage")}',
                data:'page='+page,//
                type:'POST',
                dataType:'JSON',
                success: function(data){
                    var arrLen = data.msg.length;
                    if(arrLen<=0){
                        me.lock();
//                         无数据
                        me.noData(true);
                        // 每次数据加载完，必须重置
                        me.resetload();
                    }else{
                        var datas = data.msg;
                        $.each(datas,function(key,v){
                            var _html='';
                            _html +='<div class="message underLine2" onclick="fnDetails(this)" n_activitie="'+v.n_activitie+'" n_type="'+v.n_type+'" tapmode="active" n_id="'+v.n_id+'">';
                             _html +='<div class="tit flex-wrap">';
                             if(v.read==2){
                                _html +='<div class="red_dot"></div>';
                             }
                            if(v.n_type==1){

                            _html +=' <div class="flex-con aui-ellipsis-2">系统消息</div>';
                            }else if(v.n_type==2){
                                _html +=' <div class="flex-con aui-ellipsis-2">活动报名</div>';

                            }else if(v.n_type==3){
                                _html +=' <div class="flex-con aui-ellipsis-2">活动开始</div>';

                            } else if(v.n_type==4){
                                _html +=' <div class="flex-con aui-ellipsis-2">活动签到</div>';
                        }
                        _html +='<div class="time">'+v.n_createtime+'</div> </div>';

                         if(v.n_type==1){
                         _html +='<div class="flex-wrap">';
                         _html +='<div class="message_pic"><img src="__IMG__132413775293291296.png"/></div>';
                          _html +='<div class="flex-con aui-ellipsis-2 content">'+v.n_title+'</div>';

                         }  else if(v.n_type==2){
                             _html +='<div class="flex-wrap">';
                             _html +='<div class="message_pic"><img src="__IMG__132413775293291296.png"/></div>';
                             _html +='<div class="flex-con aui-ellipsis-2 content">'+v.n_title+'</div>';
                         } else if(v.n_type==3){
                             _html +='<div class="flex-wrap">';
                             _html +='<div class="message_pic"><img src="__IMG__840968833709767202.png"/></div>';
                             _html +='<div class="flex-con aui-ellipsis-2 content">'+v.n_title+'</div>';
                         }else if(v.n_type==4){
                             _html +='<div class="flex-wrap">';
                             _html +='<div class="message_pic"><img src="__IMG__879673021421927563.png""/></div>';
                             _html +='<div class="flex-con aui-ellipsis-2 content">'+v.n_title+'</div>';
                         }
                         _html +='</div>';


                            $(".upOrDown_data").append(_html);

                        });
//                        $('.upOrDown_data').append(data);
                        // 每次数据加载完，必须重置
                        me.resetload();
                    }


                },
                error: function(xhr, type){
//                    alert('Ajax error!');
                    // 即使加载出错，也得重置
                    me.resetload();
                }
            });
        },
        loadUpFn : function(me){

            page = 1;
            $.ajax({
                url:'{:url("First/ajaxmessage")}',
                data:'page='+page,
                type:'POST',
                dataType:'json',
                success: function(data){
                    $('.upOrDown_data').empty();//
                    var datas = data.msg;
                    $.each(datas,function(key,v){
                        var _html='';
                        _html +='<div class="message underLine2" onclick="fnDetails(this)" n_activitie="'+v.n_activitie+'" n_type="'+v.n_type+'" tapmode="active" n_id="'+v.n_id+'">';
                        _html +='<div class="tit flex-wrap">';
                        if(v.read==2){
                            _html +='<div class="red_dot"></div>';
                        }
                        if(v.n_type==1){

                            _html +=' <div class="flex-con aui-ellipsis-2">系统消息</div>';
                        }else if(v.n_type==2){
                            _html +=' <div class="flex-con aui-ellipsis-2">活动报名</div>';

                        }else if(v.n_type==3){
                            _html +=' <div class="flex-con aui-ellipsis-2">活动开始</div>';

                        } else if(v.n_type==4){
                            _html +=' <div class="flex-con aui-ellipsis-2">活动签到</div>';
                        }
                        _html +='<div class="time">'+v.n_createtime+'</div> </div>';

                        if(v.n_type==1){
                            _html +='<div class="flex-wrap">';
                            _html +='<div class="message_pic"><img src="__IMG__132413775293291296.png"/></div>';
                            _html +='<div class="flex-con aui-ellipsis-2 content">'+v.n_title+'</div>';

                        }  else if(v.n_type==2){
                            _html +='<div class="flex-wrap">';
                            _html +='<div class="message_pic"><img src="__IMG__132413775293291296.png"/></div>';
                            _html +='<div class="flex-con aui-ellipsis-2 content">'+v.n_title+'</div>';
                        } else if(v.n_type==3){
                            _html +='<div class="flex-wrap">';
                            _html +='<div class="message_pic"><img src="__IMG__840968833709767202.png"/></div>';
                            _html +='<div class="flex-con aui-ellipsis-2 content">'+v.n_title+'</div>';
                        }else if(v.n_type==4){
                            _html +='<div class="flex-wrap">';
                            _html +='<div class="message_pic"><img src="__IMG__879673021421927563.png""/></div>';
                            _html +='<div class="flex-con aui-ellipsis-2 content">'+v.n_title+'</div>';
                        }
                        _html +='</div>';

                        $(".upOrDown_data").append(_html);
                    });
                    me.resetload();
                    me.unlock();
                    me.noData(false);
//                    $('.cooc').click(function () {
//                        var id = $(this).attr('id');
//                        location.href = '{:url("Mechanism/mechanismDetail")}?id='+id;
//                    });
                },
                error: function(xhr, type){
//                    alert('Ajax error!');
                    me.resetload();
                }
            });
        }
    });
</script>
</html>
